<template>
  <el-row :gutter="20">
    <el-col :lg="24" :md="24">
      <el-card>
        <div class="ph-title">柱状图（占位）</div>
        <div class="ph-box">安装 echarts 后显示图表</div>
      </el-card>
    </el-col>
    <el-col :lg="12" :md="24">
      <el-card>
        <div class="ph-title">饼图（占位）</div>
        <div class="ph-box">安装 echarts 后显示图表</div>
      </el-card>
    </el-col>
    <el-col :lg="12" :md="24">
      <el-card>
        <div class="ph-title">环形图（占位）</div>
        <div class="ph-box">安装 echarts 后显示图表</div>
      </el-card>
    </el-col>
  </el-row>
</template>

<script setup>
defineOptions({ name: 'AdminChartPlaceholder' });
</script>

<style scoped>
.ph-title { font-weight:bold; margin-bottom:8px; text-align:left; }
.ph-box { height:320px; border:1px dashed #c0c4cc; color:#909399; display:flex; align-items:center; justify-content:center; background:#fafafa; }
</style>


















